import React from 'react';
import ReactDOM from 'react-dom';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
import { Spin, Alert, Button, Modal, Icon, Progress } from 'antd';
import { WeaTools, WeaTab, WeaPopoverHrm, WeaBrowser, WeaNewScrollPagination, WeaInput, WeaLocaleProvider, WeaAvatar } from 'ecCom';
import moment from 'moment';
import TaskAdd from '../../../task/TaskAdd.js';
import './style/';

const getLabel = WeaLocaleProvider.getLabel;
const taskStatusMap = {
    "1": {
        name: getLabel(1960, '进行中'),
        lablecolor: "#7EB9FF"
    },
    "2": {
        name: getLabel(23774, '已完成'),
        lablecolor: "#68D358"
    },
    "4": {
        name: getLabel(515068, '待确认'),
        lablecolor: "#eaa81c"
    },
    "5": {
        name: getLabel(83221, "已拒绝"),
        lablecolor: "#333"
    },
    "6":{
        name: getLabel(19134,"审批中"),
        lablecolor: "rgb(76, 23, 23)"
    }
}

@inject("TaskElementStore")
@observer
class View extends React.Component {
    constructor(props) {
        super(props)

        this.state = {
            topTab: [],
            counts: {},
            currListDatas: [],
            currListHasMore: true,
            currListPageNum: 1,
            currListFirstQueryTotal: 0,         // 当前tab页列表的首次查询数据总数，并不是该tab页的所有数据的总数
            currListExcludedTaskIds: [],        // 当前tab页列表在进行更多查询时需要排除掉的任务id
            loading: false,
            selectedKey: 1,
            makeTaskDialogVisible: false,
            subordinateInput: [],
            taskInputValue: "",
            right: "",
            defaultPagesize: "4"
        }
    }

    componentWillMount() {
        WeaTools.callApi('/api/workrelate/common/checkHasRigth', 'GET', { id: "2" }).then((result) => {
            if (result.isRight) {
                this.setState({
                    right: "1"
                }, () => {
                    this.doNext()
                })
            } else {
                this.setState({
                    right: "0"
                })
            }
        })
    }

    componentDidMount() {

    }

    doNext = () => {
        const { params = {}, TaskElementStore } = this.props;
        const { eid } = params;

        WeaTools.callApi('/api/workrelate/portal/element/getSettingData', 'GET', { eid }).then((result) => {
            if (result) {
                let topTab = [];
                for (let k in result) {
                    const { tabseq, showTotalCount } = result[k]
                    topTab.push(Object.assign({
                        color: '#ff3232',
                        groupid: tabseq,
                        status:"0",
                        showcount: showTotalCount == 1 ? true : false,
                        viewcondition: parseInt(tabseq) + 1
                    }, result[k]))
                }
                if(topTab && topTab.length>0){
                    sessionStorage.setItem("taskCondtype", topTab[0].condtype);
                    sessionStorage.setItem("taskStatus", topTab[0].status);
                }
                this.setState({
                    topTab
                }, () => {
                    // 设置初始tab数据
                    this.setTabInitDatas();
                })
            }
        });
    }

    setTabInitDatas = () => {
        const { topTab } = this.state
        topTab.forEach((d, i) => {
            window.setTimeout(() => {
                this.getListData({
                    key: d.viewcondition
                });
            }, 0)
        })
    }

    onScrollEnd = () => {
        const { topTab, selectedKey } = this.state
        let currtab = topTab[selectedKey - 1]

        if (currtab.paginate == "1") {
            this.state.currListPageNum = this.state.currListPageNum + 1
            if (this.state.currListHasMore) {
                this.getMoreListData({
                    key: selectedKey,
                    pagenum: this.state.currListPageNum
                })
            }
        }
    }

    onTabChange = (key) => {
        const { topTab } = this.state
        let currtab = topTab[key - 1]
        sessionStorage.setItem("taskCondtype", currtab.condtype);
        sessionStorage.setItem("taskStatus", currtab.status);
        this.setState({
            selectedKey: key,
            subordinateInput: [],
            currListDatas: [],
            currListExcludedTaskIds: [],
            currListHasMore: true,
            currListPageNum: 1
        }, () => {
            this.getListData({
                key
            })
        })
    }

    getOrderby = (orderbytxt) => {
        let orderbyField = []
        let orderbyType = []
        if (orderbytxt) {
            orderbytxt.split(',').forEach((d, i) => {
                let orderNameTypeArr = d.split("-")

                if (orderNameTypeArr[0] == getLabel(30436, "创建时间")) {
                    orderbyField.push("createdate")
                } else if (orderNameTypeArr[0] == getLabel(500371, "开始时间")) {
                    orderbyField.push("begindate")
                } else if (orderNameTypeArr[0] == getLabel(500372, "结束时间")) {
                    orderbyField.push("enddate")
                } else if (orderNameTypeArr[0] == getLabel(16936, "责任人")) {
                    orderbyField.push("principalid")
                } else if (orderNameTypeArr[0] == getLabel(882, '创建人')) {
                    orderbyField.push("creater")
                } else if (orderNameTypeArr[0] == "进度") {
                    orderbyField.push("taskprogress")
                }

                if (orderNameTypeArr[1] == getLabel(384984, "降序")) {
                    orderbyType.push("desc")
                } else if (orderNameTypeArr[1] == getLabel(384985, "升序")) {
                    orderbyType.push("asc")
                }
            })

            //orderbyField = orderbyField.replace(new RegExp("#{orderType}", "gm"), orderbyType)
        }

        // 默认都添加按id排序
        // orderbyField.push("id")
        // orderbyType.push("desc")

        return {
            field: orderbyField.join(","),
            type: orderbyType.join(",")
        }
    }

    addExteralParam = (requestParam) => {
        if (requestParam.level) {
            requestParam.lev = requestParam.level
        }
        if (!requestParam.status) {
            requestParam.status = "0"
        }
    }

    getListData = (params) => {
        this.setState({
            loading: true
        })

        const { topTab, defaultPagesize } = this.state
        const currtab = topTab[params.key - 1]
        const { orderby, paginate, pagesize = defaultPagesize } = currtab

        let orderbyParam = this.getOrderby(orderby)
        let requestParam = Object.assign({}, currtab, {
            hrmid: params.hrmid || "",
            orderby: orderbyParam.field,
            orderbytype: orderbyParam.type,
            pagesize: paginate == "1" ? (parseInt(pagesize) + 1) + "" : parseInt(pagesize) + ""
        })
        this.addExteralParam(requestParam)

        WeaTools.callApi('/api/workrelate/task/getTaskList', 'GET', requestParam).then((result) => {
            let currListDatas = []
            let groupid = params.key - 1 + ""
            this.state.counts[groupid] = result.total
            // this.state.counts[groupid] = currtab.paginate == "1" ? result.total : result.datas.length

            result.datas && result.datas.forEach((d, i) => {
                currListDatas.push(d)
            })
            this.setState({
                loading: false,
                counts: this.state.counts
            })
            if (params.key == this.state.selectedKey) {
                this.setState({
                    currListDatas,
                    currListFirstQueryTotal: result.total,
                    currListExcludedTaskIds: [],
                    currListHasMore: result.hasmore == "2"
                })
            }
        })
    }

    getMoreListData = (params) => {
        this.setState({
            loading: true
        })

        const { topTab, defaultPagesize } = this.state
        const currtab = topTab[params.key - 1]

        const { orderby, paginate, pagesize = defaultPagesize } = currtab
        let orderbyParam = this.getOrderby(orderby)
        let requestParam = Object.assign({}, currtab, {
            orderby: orderbyParam.field,
            orderbytype: orderbyParam.type,
            pagenum: params.pagenum,
            pagesize: paginate == "1" ? (parseInt(pagesize) + 1) + "" : parseInt(pagesize) + "",
            sorttype: 1,
            total: this.state.currListFirstQueryTotal,
            excludeids: this.state.currListExcludedTaskIds.join(",")
        })
        this.addExteralParam(requestParam)

        WeaTools.callApi('/api/workrelate/task/getMoreList', 'GET', requestParam).then((result) => {
            result.datas && result.datas.forEach((d, i) => {
                this.state.currListDatas.push(d)
            })
            this.setState({
                loading: false,
                currListDatas: this.state.currListDatas,
                currListHasMore: result.hasmore == "2" ? true : false
            })
        })
    }

    onQuickCreateTask = () => {
        const { taskInputValue } = this.state
        if (taskInputValue && taskInputValue.trim() != "" && taskInputValue.trim() != "null") {
            this.setState({
                loading: true,
                taskInputValue: ""
            })
            WeaTools.callApi('/api/workrelate/task/addTask', 'POST', { taskName: taskInputValue.trim() }).then((result) => {
                this.setState({
                    loading: false
                })
                const { taskId, lastname, status } = result
                this.onTaskCreateSuccess(taskId)
            })
        }
    }

    onTaskCreateSuccess = (taskId) => {
        const { topTab, defaultPagesize, counts, selectedKey, currListExcludedTaskIds, currListDatas } = this.state
        if (topTab.length > 0) {
            let currtab = topTab[selectedKey - 1]
            const { pagesize = defaultPagesize } = currtab
    
            this.setState({
                loading: true
            })
            WeaTools.callApi('/api/workrelate/task/getTaskList', 'GET', Object.assign({}, currtab, {
                orderby: "",
                orderbytype: "",
                pagesize: currtab.paginate == "1" ? (parseInt(pagesize) + 1) + "" : parseInt(pagesize) + "",
                targetTaskid: taskId
            })).then(res => {
                this.setState({
                    loading: false
                })
                if (res.status) {
                    if (res.datas && res.datas.length > 0) {
                        let data = res.datas[0]
                        counts[currtab.groupid] += 1
                        currListExcludedTaskIds.push(data.key)
                        currListDatas.unshift({
                            comsbtn: data.comsbtn.filter((d, i) => {
                                return d.type != 'addfb' && d.type != 'delete'
                            }),
                            ...data
                        })
    
                        this.setState({
                            counts,
                            currListDatas,
                            currListExcludedTaskIds
                        })
                    }
                }
            })
        }
    }

    onMakeTaskClick = () => {
        this.setState({
            makeTaskDialogVisible: true
        })
    }

    onMakeTaskSaveSuccess = (result) => {
        if (result) {
            this.setState({
                makeTaskDialogVisible: false
            })
            result.datas.forEach((data, di) => {
                this.onTaskCreateSuccess(data.key)
            })
        }
    }

    // 移除列表中的某条任务数据
    removeTaskItem = (taskid) => {
        const { selectedKey, topTab, counts } = this.state
        let currtab = topTab[selectedKey - 1]

        let newListDatas = []
        this.state.currListDatas.forEach((d, i) => {
            if (d.key != taskid) {
                newListDatas.push(d)
            }
        })

        counts[currtab.groupid] -= 1
        this.setState({
            counts,
            currListDatas: newListDatas
        })
    }

    onTaskListRightBtnClick = (e) => {
        let elementid = e.currentTarget.id
        let operationType = e.currentTarget.getAttribute("type")
        let taskid = elementid.substring(elementid.lastIndexOf("-") + 1)
        let btnidx = elementid.substring(elementid.lastIndexOf("_") + 1, elementid.lastIndexOf("-"))
        const { selectedKey, topTab, counts } = this.state

        switch (operationType) {
            case "special":
            case "canclespecial": {
                this.setState({
                    loading: true
                })
                WeaTools.callApi('/api/workrelate/task/setSpecial', 'GET', {
                    taskid,
                    special: operationType == "special" ? "0" : "1"
                }).then((result) => {
                    if (result && result.status == "1") {
                        let currtab = topTab[selectedKey - 1]
                        let condtype = currtab.condtype
                        if (condtype == "6") {   // 我关注的任务
                            this.getListData({
                                key: this.state.selectedKey
                            })
                        } else {
                            this.setState({
                                loading: false
                            })
                            this.state.currListDatas.forEach((d, i) => {
                                if (d.key == taskid) {
                                    d.comsbtn[parseInt(btnidx)] = result.smap
                                    this.setState({
                                        currListDatas: this.state.currListDatas
                                    })
                                }
                            })
                        }
                    }
                })
                break
            }
            case "complete":
            case "progress": {
                Modal.confirm({
                    title: getLabel(131329, '信息确认'),
                    width: 420,
                    content: operationType == "complete" ? getLabel(508674, '确认要标记此任务为完成吗？') : getLabel(508676, '确认要标记此任务为进行中吗？'),
                    onOk: () => {
                        this.setState({
                            loading: true
                        })
                        WeaTools.callApi('/api/workrelate/task/changeStatus', 'GET', {
                            taskId: taskid,
                            status: operationType == "complete" ? "2" : "1"
                        }).then((result) => {
                            if (result && result.status == "1") {
                                let currtab = topTab[selectedKey - 1]
                                let tabTaskStatus = currtab.status
                                if (tabTaskStatus && tabTaskStatus != "0") {
                                    this.getListData({
                                        key: this.state.selectedKey
                                    })
                                } else {
                                    this.setState({
                                        loading: false
                                    })
                                    this.state.currListDatas.forEach((d, i) => {
                                        if (d.key == taskid) {
                                            d.comsbtn[parseInt(btnidx)] = result.smap
                                            d.status = operationType == "complete" ? "2" : "1"
                                            if (operationType == "complete") {
                                                d.taskprogress = "100"
                                                d.overtime = false
                                            } else {
                                                d.overtime = result.overtime
                                            }
                                            this.setState({
                                                currListDatas: this.state.currListDatas
                                            })
                                        }
                                    })
                                }
                            }
                        })
                    },
                    onCancel() { },
                })
                break
            }
        }
    }

    onHrmChange = (datas) => {
        const { selectedKey } = this.state

        this.setState({
            subordinateInput: datas,
            currListDatas: [],
            currListExcludedTaskIds: [],
            currListHasMore: true,
            currListPageNum: 1
        }, () => {
            this.getListData({
                key: selectedKey,
                hrmid: datas.length > 0 ? datas[0].id : ""
            })
        })
    }

    getFieldPercent = (fieldname, fieldshow) => {
        const { selectedKey, topTab } = this.state
        const currtab = topTab[selectedKey - 1]

        let fieldshowDatas = toJS(this.props.TaskElementStore.defaultCurrSettingItemData).fieldshowTransferDatas
        let fieldProportion = 0
        let fieldshowTotalProportion = 0

        if (currtab && currtab.displayType && currtab.displayType != "1") {
            if (fieldname == "name") {
                return "100%"
            }
            fieldshowDatas = fieldshowDatas.filter((fd, fi) => fd.fieldname != "name")
            if (currtab.displayType == "3") {
                fieldshowDatas = fieldshowDatas.filter((fd, fi) => fd.fieldname != "taskprogress")
            } else if (currtab.displayType == "4") {
                // if (currtab.showAvator == "principal") {
                //     fieldshowDatas = fieldshowDatas.filter((fd, fi) => fd.fieldname != "principalid")
                // } else if (currtab.showAvator == "creater") {
                //     fieldshowDatas = fieldshowDatas.filter((fd, fi) => fd.fieldname != "creater")
                // }
            }
        }

        fieldshow.split(",").forEach((d, i) => {
            fieldshowDatas.forEach((dd, ii) => {
                if (fieldname == dd.fieldname) {
                    fieldProportion = dd.proportion
                }
                if (d == dd.fieldname) {
                    fieldshowTotalProportion += dd.proportion
                }
            })
        })

        return fieldshowTotalProportion == 0 ? "0%" : Math.floor((fieldProportion / fieldshowTotalProportion) * 10000) / 100 + "%"
    }

    getFieldInfo = (fieldname, fieldshow) => {
        let fieldshowTransferDatas = toJS(this.props.TaskElementStore.defaultCurrSettingItemData).fieldshowTransferDatas
        let arr = fieldshowTransferDatas.filter((d, i) => d.fieldname == fieldname)
        let percent = this.getFieldPercent(fieldname, fieldshow)
        if (arr.length > 0) {
            return {
                id: arr[0].id,
                name: arr[0].name,
                maxWidth: arr[0].maxWidth,
                percent
            }
        }
        return null
    }

    getDisplayFields = () => {
        const { selectedKey, topTab } = this.state
        const currtab = topTab[selectedKey - 1]
        let fieldshow = ""
        if (currtab) {
            fieldshow = currtab.fieldshow || "name,principalid,status,enddate"
        }

        let displayFields = []
        let arr = fieldshow.split(",")
        if (fieldshow) {
            arr.forEach((fieldname, i) => {
                const fieldInfo = this.getFieldInfo(fieldname, fieldshow)
                fieldInfo && displayFields.push({
                    id: fieldInfo.id,
                    fieldname,
                    showname: fieldInfo.name,
                    maxWidth: fieldInfo.maxWidth,
                    percent: fieldInfo.percent
                })
            })
        }

        return (currtab && currtab.displayType == "1") ? displayFields : displayFields.sort((a, b) => a.id - b.id)      // 只有单行显示可以自定义字段排序
    }

    render() {
        const { selectedKey, topTab, counts, lists, alert, currListDatas, loading, makeTaskDialogVisible, subordinateInput, right, defaultPagesize } = this.state
        const { nodata, noright, getUrgentShownameByKey } = this.props.TaskElementStore
        const currtab = topTab[selectedKey - 1]
        const pagesize = (currtab && currtab.pagesize) ? currtab.pagesize : defaultPagesize
        const isSingleRowDisplay = !currtab || (currtab.displayType == "1" || !currtab.displayType)
        const isPercentDispaly = (currtab && currtab.displayType == "3")
        const isAvatorDispaly = (currtab && currtab.displayType == "4")

        return right == "1" ? (
            <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@81gzaf`} spinning={loading}>
                <div className="portal-task-element-view">
                    <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@8z3r1w`} />
                    <div className="tab-search-wrapper">
                        <div className="tab-wrapper">
                            <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@6zmloi`}
                                datas={topTab}
                                counts={counts}
                                keyParam="viewcondition"
                                countParam="groupid"
                                onChange={this.onTabChange}
                                selectedKey={selectedKey}
                            />
                        </div>
                        {
                            topTab && topTab.length > 0 && topTab[selectedKey - 1].showSubordinateFilter == "1" &&
                            <div className="search-wrapper">
                                <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@7339xf`} />
                                <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@tct7qh`}
                                    type={"wrltsk"}
                                    completeURL={"/api/workrelate/task/doorpage/getUnderlingHrmInfo?subtype=" + (topTab[selectedKey - 1].subtype || "1") + "&"}
                                    inputStyle={{ width: 120, display: "inline-block" }}
                                    hideOps={true}
                                    placeholder={getLabel(515681, "请输入下属名称")}
                                    onChange={(ids, names, datas) => this.onHrmChange(datas)}
                                    replaceDatas={subordinateInput}
                                />
                            </div>
                        }
                    </div>
                    <div className="main-content">
                        {
                            currtab && currtab.displayType == "1" && currtab.showTableHeader == "1" &&
                            <div className="table-header">
                                {
                                    this.getDisplayFields().map((field, i) => {
                                        return (
                                            <span
                                                style={{ width: field.percent }}
                                                className="task-common"
                                                title={field.showname}
                                            >
                                                {field.showname}
                                            </span>
                                        )
                                    })
                                }
                            </div>
                        }
                        <WeaNewScrollPagination ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScrollPagination@9a6f92`} height={parseInt(pagesize) * (isSingleRowDisplay ? 40 : 60) + 8} loading={loading} intervalTime={500} offset={10} onScrollEnd={this.onScrollEnd}>
                            <div className="list-container">
                                {
                                    currListDatas.map((d, i) => {
                                        // const isOverdue = (d.status != "2" && d.enddate && d.enddate < moment().format('YYYY-MM-DD'))
                                        const isOverdue = d.overtime
                                        const progressColor = isOverdue ? "#FF7F7F" : taskStatusMap[d.status].lablecolor
                                        return (
                                            <div className="task-wrapper" id={"task-" + d.key} style={{ height: isSingleRowDisplay ? 40 : 60 }}>
                                                {
                                                    (isPercentDispaly || isAvatorDispaly) &&
                                                    <span className="taskitem-content-left">
                                                        {
                                                            isPercentDispaly ?
                                                                <Progress ecId={`${this && this.props && this.props.ecId || ''}_Progress@ykmyto@${d.key}`}
                                                                    type="circle"
                                                                    percent={(d.taskprogress && d.taskprogress != "0") ? parseInt(d.taskprogress) : 1}
                                                                    width={45}
                                                                    strokeColor={progressColor}
                                                                    format={percent => {
                                                                        return (
                                                                            <span style={{ color: progressColor }}>
                                                                                {(d.taskprogress || "0") + "%"}
                                                                            </span>
                                                                        )
                                                                    }}
                                                                />
                                                                :
                                                                <span
                                                                    className="avatar"
                                                                    onClick={(e) => {
                                                                        window.pointerXY(e)
                                                                        openhrm(currtab.showAvator == "principal" ? d.rightData[0].userid : d.creater.id)
                                                                    }}
                                                                >
                                                                    <WeaAvatar ecId={`${this && this.props && this.props.ecId || ''}_WeaAvatar@gsoujq@${d.key}`} userId={currtab.showAvator == "principal" ? d.rightData[0].userid : d.creater.id} />
                                                                </span>
                                                        }
                                                    </span>
                                                }
                                                <span className="taskitem-content-right">
                                                    <div className="taskitem-content-right-abs">
                                                        {
                                                            this.getDisplayFields().map((field, i) => {
                                                                let commonFieldStyle = isSingleRowDisplay ? { width: field.percent } : { width: field.percent, maxWidth: field.maxWidth }
                                                                if (field.fieldname == "name") {
                                                                    return (
                                                                        <span
                                                                            style={{ width: field.percent }}
                                                                            className={"task-common task-name " + (isSingleRowDisplay ? "" : "task-name-nosingle")}
                                                                            title={d.title}
                                                                            onClick={(e) => {
                                                                                window.open("/spa/workrelate/static/index.html#/main/workrelate/task/taskDetail?id=" + d.key)
                                                                            }}
                                                                        >
                                                                            <span style={{ color: isOverdue ? "#FF7F7F" : "#333" }}>
                                                                                {d.title}
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "status") {
                                                                    return (
                                                                        <span
                                                                            style={commonFieldStyle}
                                                                            className={"task-common task-status " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span
                                                                                title={getLabel(23247, '状态') + ": " + taskStatusMap[d.status].name}
                                                                                style={{ background: taskStatusMap[d.status].lablecolor, color: "#fff" }}
                                                                            >
                                                                                {taskStatusMap[d.status].name}
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "taskprogress" && !isPercentDispaly) {
                                                                    return (
                                                                        <span
                                                                            style={commonFieldStyle}
                                                                            className={"task-common task-taskprogress " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span style={{ maxWidth: 200 }}>
                                                                                <Progress ecId={`${this && this.props && this.props.ecId || ''}_Progress@8vdwwy@${d.key}`}
                                                                                    percent={(d.taskprogress && d.taskprogress != "0") ? parseInt(d.taskprogress) : 1}
                                                                                    strokeWidth={10}
                                                                                    strokeColor={isOverdue ? "#FF7F7F" : (d.status == "1" ? "#7EB9FF " : "#68D358")}
                                                                                    format={percent => {
                                                                                        return (
                                                                                            <span style={isOverdue ? { color: "#FF7F7F" } : {}}>
                                                                                                {(d.taskprogress || "0") + "%"}
                                                                                            </span>
                                                                                        )
                                                                                    }}
                                                                                />
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "lev") {
                                                                    return (
                                                                        <span
                                                                            style={commonFieldStyle}
                                                                            className={"task-common task-lev " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span title={getLabel(15534, '紧急程度') + ": " + getUrgentShownameByKey(d.lev)}>
                                                                                {getUrgentShownameByKey(d.lev)}
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "principalid") {
                                                                    return (
                                                                        <span
                                                                            style={commonFieldStyle}
                                                                            className={"task-common task-principalid " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span style={{ cursor: "pointer" }}>
                                                                                <a
                                                                                    href={"javaScript:openhrm(" + d.rightData[0].userid + ");"}
                                                                                    onClick={e => window.pointerXY(e)}
                                                                                    title={getLabel(16936, '责任人') + ": " + d.rightData[0].name}
                                                                                >
                                                                                    {d.rightData[0].name}
                                                                                </a>
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "creater") {
                                                                    return (
                                                                        <span
                                                                            style={commonFieldStyle}
                                                                            className={"task-common task-creater " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span style={{ cursor: "pointer" }}>
                                                                                <a
                                                                                    href={"javaScript:openhrm(" + d.creater.id + ");"}
                                                                                    onClick={e => window.pointerXY(e)}
                                                                                    title={getLabel(882, '创建人') + ": " + d.creater.name}
                                                                                >
                                                                                    {d.creater.name}
                                                                                </a>
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "begindate") {
                                                                    return (
                                                                        <span
                                                                            style={commonFieldStyle}
                                                                            className={"task-common task-commondate " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span title={getLabel(500371, "开始时间") + ": " + d.begindate}>
                                                                                {d.begindate}
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                } else if (field.fieldname == "enddate") {
                                                                    return (
                                                                        <span
                                                                            style={isOverdue ? { ...commonFieldStyle, color: "#FF7F7F" } : commonFieldStyle}
                                                                            className={"task-common task-commondate " + (isSingleRowDisplay ? "" : "task-common-nosingle")}
                                                                        >
                                                                            <span title={getLabel(500372, '结束时间') + ": " + d.enddate}>
                                                                                {d.enddate}
                                                                            </span>
                                                                        </span>
                                                                    )
                                                                }
                                                            })
                                                        }
                                                    </div>
                                                </span>

                                                <span className="task-operation-wrapper" style={{ height: isSingleRowDisplay ? 40 : 60 }}>
                                                    {
                                                        d.comsbtn.map((dd, ii) => {
                                                            return (
                                                                ["special", "canclespecial", "complete", "progress"].indexOf(dd.type) === -1 ? "" :
                                                                    <span id={`task-operation_${ii}-${d.key}`} className="task-operation" type={dd.type} onClick={this.onTaskListRightBtnClick}>
                                                                        <span>
                                                                            {dd.com}
                                                                        </span>
                                                                    </span>
                                                            )
                                                        })
                                                    }
                                                </span>
                                            </div>
                                        )
                                    })
                                }
                                {
                                    ((!currListDatas || currListDatas.length == 0) && !loading) ? nodata : ""
                                }
                            </div>
                        </WeaNewScrollPagination>
                    </div>
                    <div className="iptdiv-wrapper">
                        <div className="ipt">
                            <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@4gxuoz`}
                                id='addtask'
                                className="intext"
                                value={this.state.taskInputValue}
                                placeholder={getLabel(508695, '请输入一句话快速创建任务')}
                                onBlur={this.onQuickCreateTask}
                                onChange={(value) => { this.setState({ taskInputValue: value }) }}
                                onKeyPress={(e) => {
                                    if (e.nativeEvent.keyCode == 13) {
                                        this.onQuickCreateTask()
                                    }
                                }}
                            />
                        </div>
                        <div className="add-task" onClick={this.onMakeTaskClick}>{"+" + getLabel(15266, '新建任务')}</div>
                    </div>
                    {makeTaskDialogVisible &&
                        <TaskAdd ecId={`${this && this.props && this.props.ecId || ''}_TaskAdd@k4x5i8`}
                            isDialog={true}
                            createvisable={makeTaskDialogVisible}
                            style={{ width: window.innerWidth * 0.7, height: window.innerHeight - 90 }}
                            _minusHeight={90}
                            onlyClose={() => this.setState({ makeTaskDialogVisible: false })}
                            onAddSuccess={this.onMakeTaskSaveSuccess}
                        />
                    }
                </div>
            </Spin>
        ) : (right == "0" ? noright : "")
    }
}

export default View;
